<!DOCTYPE html>
<html>
  <head>
    <!-- meta name="viewport" content="width=device-width, height=device-height, user-scalable=yes, initial-scale=2.0, maximum-scale=4.0, minimum-scale=1.0" / -->
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"/> <!-- ISO-8859-1 -->
    <title>Cordova</title>
    <link rel="stylesheet" href="master.css" type="text/css" media="screen" title="no title" charset="utf-8"/>

    <script type="text/javascript" charset="utf-8" src="cordova-1.7.0.js"></script>


    <script type="text/javascript" charset="utf-8">

    var deviceReady = false;

    //-------------------------------------------------------------------------
    // Notifications
    //-------------------------------------------------------------------------

    function getConnectionState()
	{
        var networkState = navigator.network.connection.type;

        var states = {};
        states[Connection.UNKNOWN]  = 'Unknown connection';
        states[Connection.ETHERNET] = 'Ethernet connection';
        states[Connection.WIFI]     = 'WiFi connection';
        states[Connection.CELL_2G]  = 'Cell 2G connection';
        states[Connection.CELL_3G]  = 'Cell 3G connection';
        states[Connection.CELL_4G]  = 'Cell 4G connection';
        states[Connection.NONE]     = 'No network connection';


        document.getElementById("info").innerHTML = 'Connection type: ' + networkState;
    };






    /**
     * Function called when page has finished loading.
     */
    function init() {



        document.addEventListener("deviceready", function() {
                deviceReady = true;
                console.log("Device="+device.platform+" "+device.version);

				Cordova.onCordovaConnectionReady.subscribeOnce(getConnectionState);

            }, false);
        window.setTimeout(function() {
        	if (!deviceReady) {
        		console.log("Error: Cordova did not initialize.  Demo will not run correctly.");
        	}
        },1000);
    }

</script>

  </head>
  <body onLoad="init();" id="stage" class="theme">

    <h1>Network Connection</h1>
    <div id="info">
    </div>

    <h2>Action</h2>
    <a href="#" class="btn large" onClick="getConnectionState();">Get Connection State</a>

    <a href="index.html" class="backBtn">Back</a>
  </body>
</html>